<template>
  <div class="mb18">
    <div
      v-if="tagType && tagType!== 'CUSTOM'"
      style="margin-bottom:10px;font-size: 14px;color: #606266;"
    >{{ title }}</div>
    <el-input type="textarea" :rows="5" placeholder="请输入内容" :value="val" @input="input" />
  </div>
</template>
<script>
/**
 * @Method dict
 * @Description TODO
 * @Date 2021/1/20 11:14
 * @Created by HePing
 */
const defaultData = () => [{ label: "", value: "" }];
export default {
  name: "VeJson",
  model: {
    prop: "model",
  },
  props: {
    model: {
      type: [Array, Object],
      default() {
        return defaultData();
      },
    },
    config: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {
      datum: {
        label: "",
        value: "",
      },
    };
  },
  computed: {
    val() {
      return this.model && typeof this.model === "object"
        ? JSON.stringify(this.model, null, "\t")
        : "";
    },
    title() {
      return (
        (this.config && this.config.item && this.config.item.label) ||
        "选项列表"
      );
    },
    tagType() {
      return this.config && this.config.widget && this.config.item.tagType;
    },
  },
  methods: {
    input(v) {
      if (!v) return;
      try {
        const val = JSON.parse(v);
        this.$emit("input", val);
      } catch (error) {}
    },
  },
};
</script>
<style lang="scss" scoped>
.mb18 {
  margin-bottom: 18px;
}
</style>
